<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			li{line-height: 48px;}
			
			#te{position:absolute;top:0;left:0;display:none;padding:10px;width:200px;background:orange;box-shadow: 0 0 5px #0000FF;}
		</style> 
	</head>
	<body>
		<ol>
			<li><a href="#" index="0">中国嫦娥发的一些梦</a></li>
			<li><a href="#" index=1>世界那么大你要到哪里建个群</a></li>
		</ol>
		<div id="te">极乐空间立刻就弄了奇偶就OK炯炯经济</div>
	<script type="text/javascript">
			window.onload=function(){
				var oA=document.getElementsByTagName('a');//取元素集合
				var oTe=document.getElementById('te')//id对象
////				var arr=[111111111111111111111,2222]//数字不要太长  不然后面会、。。。
				for(var i=0;i<oA.length;i++){
					oA[i].onmouseover=function(){//鼠标经过a标签时运行给定函数
						oTe.style.display='block';
////						this当前函数给谁调用，this指向谁
						this.onmousemove=function(ev){//鼠标移动时
							var ev=ev||window.event;//取到事件对象	
							oTe.style.left=ev.clientX+20+'px';//鼠标的位置
							oTe.style.top=ev.clientY+20+'px';
////							oTe.innerHTML=arr[this.getAttribute('index')]//a ttri bu{玩具枪声音} te 获取特定元素节点属性的值
						}
					}
					oA[i].onmouseout=function(){//鼠标离开a标签时运行给定函数
						oTe.style.display='none'
				}
			}
		}		

		

		</script>
	</body>
</html>
